<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .baidu {
            width: 560px;
            height: 305px;
            border: 1px solid red;
            overflow: hidden;
            cursor: pointer;
        }
        
        #pics {
            width: 560px;
        }
    </style>
</head>

<body>
    <div class="baidu">
        <img src="img/1.jpeg" alt="" id="pics">
    </div>
</body>

</html>
<script>
    // 1.输入一个五位数，分别输出个十百千万位 - 数学运算符
    // 两种方式进行输入：prompt/input
    // var num = prompt('请输入一个5位数：'); //12456 = + - * / %  parseInt
    // var a = parseInt(num / 10000); //万位
    // var b = parseInt(num % 10000 / 1000);
    // var c = parseInt(num % 1000 / 100);
    // var d = parseInt(num % 100 / 10);
    // var e = num % 10; //各位
    // console.log(a, b, c, d, e); //log输出多个,中间逗号分隔。

    //2.测试
    // var a = 10
    // var b = 20;
    // var c = 10;
    // console.log(a = b); //a = 20 赋值
    // console.log(a == b); // true
    // console.log(a == c); // false

    //3.元素对象的操作。
    var num = 1;
    pics.onclick = function() { //点击pics执行大括号里面的代码。
        //pics.src//img/1.jpeg //获取
        num = (num++ % 4) + 1;
        pics.src = 'img/' + num + '.jpeg'; //设置
    }
</script>